
<!DOCTYPE html>
<html lang="en">
  <head>
      <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <!-- <meta name="viewport" content="width=device-width, initial-scale=1">-->

    <title>Speakrs</title>

    <!-- ESTILO CADASTRO -->
    
    <link href="css/estilo.css" rel="stylesheet">
    

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    

    
    
    
    
    
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    
    
    
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
    
    
  </head>

  <body>

	  
	  
	  
	  
	  
	  
	  
	  <!-- CONTAINER -->
	  
	  
	  <div class="container topo">
		  
		  
		  <div class="row primeiraLinha">
			
			
			<div class="col-md-4 logo">
				
				<img src="imgs/home_logo.png" />
				
			</div>
			  
			 
			
			<div class="col-md-3 col-md-offset-5 inscrevaSe">
				
				<a href="#" class="btn btn-default btnInscrevaSe">Inscreva-se</a>
				
				
			</div>
			
			
			
			
			<div class="row">
				
				<div class="col-md-12 titulosTxt">
				
				<h1 class="homeTitulo">viva experiências locais</h1>
				<h2 class="homeSubTitulo">descubra atividades com pessoas que falam sua língua nativa</h2>
				
				</div>
				
				
			</div>
			
			
			<div class="row">
				
				<div class="col-md-12 cidades">
				
				
					<ul>
					
						<li><a href="#">Fortaleza</a></li>
						<li><a href="#">Brasília</a></li>
						<li><a href="#">Madrid</a></li>
						<li><a href="#">Barcelona</a></li>
						<li class="ultima"><a href="#">São Francisco</a></li>
						
						
					</ul>
				
								
				</div>
				
				
			</div>

			
			
			
			
			
			
			
			<div class="setaBaixo">
				
				<a href="#">
					
					<img src="imgs/setaBaixo.png" />
					
				</a>
				
			</div>
			
			  
			  
		  </div><! /row primeiraLinha -->
		  
		  
		  
	  </div><!-- FIM CONTAINER -->
	  
	  
	  	  
	  
	 <!-- EXPERIENCIAS -->
	  <div class="container experiencias">
		  
		  <div class="row">
			  
			  
			  <div class="col-md-12 legendaTxt">
				  
				  
				  <h1 class="tituloContHome">experiências</h1>
				  <h2 class="subTituloContHome">Encontre uma atividade, você pode selecionar por destino<br>
ou categorias específicas (esportes, gastronomia, fotografia...)</h2>

				  
				  
			  </div><!-- /col-md-12 -->
			  
			  
		  </div><!-- / row -->
		  
		  
		  
		  <div class="row contExperiencias">
			  
			  
			  <div class="col-md-12 noPadding">
			  
			  
			  <!-- col-md-4 -->
			  <div class="col-md-4 colExp">
				  
				
				<div class="thumbnail boxExp">
				
				      <a href="#"><img class="imgExp" src="imgs/exp_img.jpg" /></a>
				      
				      <div class="caption contExp">
				      
				        <h3 class="tiExp"><a href="#">Fusce dapibus, tellus ac cursus commodo.</a></h3>
				        
				        <h4 class="tiAutor">com <a href="#">Marcos Mendes</a></h4>
				        
				        <p class="txtExp">
					    	Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam eget risus varius blandit sit amet non magna. Curabitur blandit tempus porttitor.    
				        </p>
				        
				        <div class="linhaCategoria">
							<p class="localExp"><b>Madrid</b> / Espanha</p>
						
							<p class="categoriaExp">gastronomia</p>
				        </div>
				      
				      </div>
				 
				 </div>
				 

			  </div><!-- /col-md-4 -->
			  
			  			  
			  

			

			  
			  
			
				  
 <!-- col-md-4 -->
			  <div class="col-md-4 colExp">
				  
				
				<div class="thumbnail boxExp">
				
				      <a href="#"><img class="imgExp" src="imgs/exp_img.jpg" /></a>
				      
				      <div class="caption contExp">
				      
				        <h3 class="tiExp"><a href="#">Fusce dapibus, tellus ac cursus commodo.</a></h3>
				        
				        <h4 class="tiAutor">com <a href="#">Marcos Mendes</a></h4>
				        
				        <p class="txtExp">
					    	Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam eget risus varius blandit sit amet non magna. Curabitur blandit tempus porttitor.    
				        </p>
				        
				        <div class="linhaCategoria">
							<p class="localExp"><b>Madrid</b> / Espanha</p>
						
							<p class="categoriaExp">gastronomia</p>
				        </div>
				      
				      </div>
				 
				 </div>
				 

			  </div><!-- /col-md-4 -->
			  
			  			  
			  

			

			  
			  
			
				  
 <!-- col-md-4 -->
			  <div class="col-md-4 colExp">
				  
				
				<div class="thumbnail boxExp">
				
				      <a href="#"><img class="imgExp" src="imgs/exp_img.jpg" /></a>
				      
				      <div class="caption contExp">
				      
				        <h3 class="tiExp"><a href="#">Fusce dapibus, tellus ac cursus commodo.</a></h3>
				        
				        <h4 class="tiAutor">com <a href="#">Marcos Mendes</a></h4>
				        
				        <p class="txtExp">
					    	Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam eget risus varius blandit sit amet non magna. Curabitur blandit tempus porttitor.    
				        </p>
				        
				        <div class="linhaCategoria">
							<p class="localExp"><b>Madrid</b> / Espanha</p>
						
							<p class="categoriaExp">gastronomia</p>
				        </div>
				      
				      </div>
				 
				 </div>
				 

			  </div><!-- /col-md-4 -->
			  
			  			  
			  

			

			  
			  
			
				  
 <!-- col-md-4 -->
			  <div class="col-md-4 colExp">
				  
				
				<div class="thumbnail boxExp">
				
				      <a href="#"><img class="imgExp" src="imgs/exp_img.jpg" /></a>
				      
				      <div class="caption contExp">
				      
				        <h3 class="tiExp"><a href="#">Fusce dapibus, tellus ac cursus commodo.</a></h3>
				        
				        <h4 class="tiAutor">com <a href="#">Marcos Mendes</a></h4>
				        
				        <p class="txtExp">
					    	Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam eget risus varius blandit sit amet non magna. Curabitur blandit tempus porttitor.    
				        </p>
				        
				        <div class="linhaCategoria">
							<p class="localExp"><b>Madrid</b> / Espanha</p>
						
							<p class="categoriaExp">gastronomia</p>
				        </div>
				      
				      </div>
				 
				 </div>
				 

			  </div><!-- /col-md-4 -->
			  
			  			  
			  

			

			  
			  
			
				  
 <!-- col-md-4 -->
			  <div class="col-md-4 colExp">
				  
				
				<div class="thumbnail boxExp">
				
				      <a href="#"><img class="imgExp" src="imgs/exp_img.jpg" /></a>
				      
				      <div class="caption contExp">
				      
				        <h3 class="tiExp"><a href="#">Fusce dapibus, tellus ac cursus commodo.</a></h3>
				        
				        <h4 class="tiAutor">com <a href="#">Marcos Mendes</a></h4>
				        
				        <p class="txtExp">
					    	Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam eget risus varius blandit sit amet non magna. Curabitur blandit tempus porttitor.    
				        </p>
				        
				        <div class="linhaCategoria">
							<p class="localExp"><b>Madrid</b> / Espanha</p>
						
							<p class="categoriaExp">gastronomia</p>
				        </div>
				      
				      </div>
				 
				 </div>
				 

			  </div><!-- /col-md-4 -->
			  
			  			  
			  

			

			  
			  
			
				  
 <!-- col-md-4 -->
			  <div class="col-md-4 colExp">
				  
				
				<div class="thumbnail boxExp">
				
				      <a href="#"><img class="imgExp" src="imgs/exp_img.jpg" /></a>
				      
				      <div class="caption contExp">
				      
				        <h3 class="tiExp"><a href="#">Fusce dapibus, tellus ac cursus commodo.</a></h3>
				        
				        <h4 class="tiAutor">com <a href="#">Marcos Mendes</a></h4>
				        
				        <p class="txtExp">
					    	Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam eget risus varius blandit sit amet non magna. Curabitur blandit tempus porttitor.    
				        </p>
				        
				        <div class="linhaCategoria">
							<p class="localExp"><b>Madrid</b> / Espanha</p>
						
							<p class="categoriaExp">gastronomia</p>
				        </div>
				      
				      </div>
				 
				 </div>
				 

			  </div><!-- /col-md-4 -->
			  
			  			  
			  

			

			  
			  
			
				  

				  
			  </div><!-- col-md-12 -->
			  
			  
		  </div><!-- /row -->
		  
		 
		  
		  
	  </div><!-- FIM EXPERIENCIAS --> 
	  
	  
	  
	  
	  
	  
	  
	  
	  
	  
	  	  <!-- INSCREVA-SE -->
	  <div class="container inscrevase">
		  
		  <div class="row">
			  
			  
			  <div class="col-md-12 legendaTxt">
				  
				  
				  <h1 class="tituloContHomeV">inscreva-se</h1>
				  <h2 class="subTituloContHomeV">
					  
					  Speakrs está atualmente disponível apenas para usuários convidados.<br>
					  A versão final estará disponível em breve.<br><br>
					  
					  Abaixo digite seu e-mail para obter acesso prioritário!<br>
					  <i>(Não se preocupe, só enviaremos coisas importantes)</i>
					  
				  </h2>

				  
				  
			  </div><!-- /col-md-12 -->
			  
			  
		  </div><!-- / row -->
		  
		  
		  <div class="row linhaForm">
				  
				  <div class="col-md-2"></div>
				  
				  <div class="col-md-8">
				  
					  
					 
					<!-- RESPOSTA DO CADASTRO DE EMAIL -->
						  
						  <p class="respostaInscrevaSe">
						  Email cadastrado com sucesso!<br>
						  Verifique a seu email para confirmar o seu cadastro.
						  </p>
						  
					<!-- RESPOSTA DO CADASTRO DE EMAIL -->	  
					  
					  
					  
					  <form class="form-inline" role="form">
					
						  <div class="form-group">
					
						    <input type="email" class="form-control insInput" id="exampleInputEmail1" placeholder="Digite seu email">
						    <button type="submit" class="btn btn-default btnInscrevaEmail">Inscreva-se</button>
					
						  </div>
					  
					  </form>

					  
				  </div><!-- / col-md-12 -->
				  
				  <div class="col-md-2"></div>
			   
			   
		  </div><!-- / row -->
		  
		  
	  </div><!-- FIM INSCREVA-SE -->








	   <!-- MENSAGEM -->
	  <div class="container mensagem">
		  
		  <div class="row">
			  
			  
			  <div class="col-md-12 legendaTxt">
				  
				  
				  <h1 class="tituloContHome">Experiência Personalizada</h1>
				  <h2 class="subTituloContHome">Solicite uma experiência e tire dúvidas de como funciona a plataforma.</h2>

				  
				  
			  </div><!-- /col-md-12 -->
			  
			  
		  </div><!-- / row -->
		  
		  
		  <div class="row mTop">
			  
			  <div class="col-md-3"></div>
			  
			  <div class="col-md-6">
				  
				  
				  <form class="form-horizontal" role="form">
					
						  <div class="form-group">
					
						    <input type="email" class="form-control msgInput" id="exampleInputEmail1" placeholder="Seu nome">
						    <input type="email" class="form-control msgInput" id="exampleInputEmail1" placeholder="Seu email">
						    <textarea class="form-control msgInputTA" rows="5" placeholder="Mensagem"></textarea> 

						    
						    <button type="submit" class="btn btn-default btnEnviarMsg">Enviar</button>
					
						  </div>
					  
					  </form>
				  
				  
				  
			  </div>
			  
			  <div class="col-md-3"></div>
			  
			  
		  </div>
		  
	  </div><!-- FIM MENSAGEM -->
	  
	  
	  
	  	 <div class="container rodape">
		  
		<div class="row col-centered">
			
			<div class="col-md-4">
				
				<p class="copy">Copyright © Speakrs 2014</p>
			
			</div>
			
			<div class="col-md-3 col-md-offset-5 icoRedes">
				
				<a href="#" target="_blank">
					<img src="imgs/ico_facebook.jpg" />
				</a>
				
				<a href="#" target="_blank">
					<img src="imgs/ico_twitter.jpg" />
				</a>
				
			</div>
			
		</div>
				  
	  </div><!-- /container -->

	  








    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="../../dist/js/bootstrap.min.js"></script>
  </body>
</html>
